<template>
 <div>
    <input type="text" placeholder="输入事件" @keyup.enter="add" v-model='add_info'>
 </div>
</template>

<script>
export default {
    name:'MyHeader',
    data(){
        return {
            add_info:''
        }
    },
    props:['reserive'],
    methods:{
        add(){
            if(this.add_info.trim() == '') return alert('输入不能为空')
            // console.log(even.target.value);
            const add_todo = {id:Math.random(),name:this.add_info,done:false}
            // console.log(add_todo)
            this.reserive(add_todo);
            this.add_info= ''
        }
    }
}
</script>

<style scoped>
    input{
        margin: 10px;
        width: 200px;
        height: 30px;
        border: 1px solid lightgray;
        border-radius: 10px;
        /* background-color: blue; */
    }
</style>